app/about/[name]/page.tsx


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34

import Markdown from "markdown-to-jsx";
import { notFound } from "next/navigation";

import InfoBar from "~/components/InfoBar";

import styles from "~/styles/index.module.css"
import system from "~/config/system.json"

export default function MemberPage({ params: { name } }) {
  const member = system.members.find(member => member.name.toLowerCase() === name)

  if (!member) notFound()

  return (
    <>
      <main className="mainColumn">
        <InfoBar memberName={member.name} />
        <p>{member.bioShort}</p>
        <Markdown>{member.bioContinued}</Markdown>
        {member.bioFields?.length && (

          <div className={styles.glance}>
            {member.bioFields.map(({ name, value }) => (
              <>
                <span className={styles.label}>{name}</span>
                <span>{value}</span>
              </>
            ))}
          </div>
        )}
      </main >
    </>
  )
}